<script type="text/javascript" src="../../repo/files/%3Apublic%3Aplugin-samples%3Apentaho-cdf%3A30-documentation%3A30-component_reference%3Asamples.js"></script>

<div class="shadow">

  <div class="contents">

    <h2>QueryComponent</h2>

    <h3>Description</h3>
    <p>
    Executes a query (sql or mdx) and stores the result in the component result.
    </p>

    <h3>Options</h3>

    <dl class="documentation">
      <dt>name</dt>
      <dd>The name of the component</dd>

      <dt>type</dt>
      <dd><code>queryComponent</code></dd>

      <dt>listeners</dt>
      <dd><i>Array - </i> Parameters who this component will react to</dd>

      <dt>htmlObject</dt>
      <dd>Id of the component (usually a div or a span tag)</dd>

      <dt>asynchronousMode</dt>
      <dd>Fetch query data with a asynchronous call if true, synchronous otherwise. Default is false</dd>

      <dt>refreshPeriod</dt>
      <dd>Time in seconds for this component to refresh. Default is 0 (disabled)</dd>

      <dt>executeAtStart</dt>
      <dd>True to execute the component at start, false otherwise</dd>

      <dt>preExecution</dt>
      <dd><i>Function - </i> Function to be called before the component is executed</dd>

      <dt>postExecution</dt>
      <dd><i>Function - </i> Function to be called after the component is executed</dd>

      <dt>resultvar</dt>
      <dd>variable where the result will be stored (note: the old method of accessing
      this object's  property "result" is still supported</dd>

      <dt>queryDefinition</dt>
      <dd>MetaLayer object with the definition of pivot (see MetaLayer options)</dd>
    </dl>

    <h3>MetaLayer options</h3>

    <dl class="documentation">
      <dt>queryType</dt>
      <dd>Type of query to read results from. Can be sql or mdx. Default: mdx</dd>

      <dt>jndi</dt>
      <dd>Connection to use for the query</dd>

      <dt>query</dt>
      <dd>sql or mdx Query to execute</dd>

      <dt>cube</dt>
      <dd>Cube name to use when queryType is mdx</dd>

      <dt>catalog</dt>
      <dd>Mondrian schema to use when queryType is mdx</dd>
    </dl>

    <h3>Sample</h3>

    <div id="example" class="flora">
      <ul>

        <li><a href="#sample"><span>Sample</span></a></li>
        <li><a href="#code"><span>Code</span></a></li>
      </ul>
      <div id="sample">
        <div id="sampleObject"></div>
        <div id="sampleObjectResult"></div>
      </div>


        <div id="code">
          <textarea cols="80" rows="20" id="samplecode">
require([
  'cdf/Dashboard.Blueprint',
  'cdf/components/QueryComponent'
], function(Dashboard, QueryComponent) {
  
  var dashboard = new Dashboard();
  
  dashboard.addParameter("result", "");
  


  dashboard.addComponent(new QueryComponent({
    name: "executeQueryComponent",
    type: "queryComponent",
    htmlObject: "sampleObject",
    asynchronousMode: true,
    executeAtStart: true,
    resultvar: "result",
    queryDefinition: {      dataAccessId: "region",
        path: "/public/plugin-samples/pentaho-cdf/legacy/actions/data-for-samples.cda"},
    postFetch: function(data) {
      $('#sampleObjectResult').html("" + data.resultset[3]);
    }
  }));
  dashboard.init();

});
          </textarea>
          <br />
          <button id="tryMe">Try me</button>
        </div>
      </div>

    </div>
  </div>
